 <#include "admin/common/include/html_head.html"> <#include
"admin/common/include/sysparam.html">
<style>

/* .first_container h3 {
    margin: 0;
    padding: 0;
    font-size: 36px;
    line-height: 36px;
    position: relative;
    margin-bottom: 54px;
}

em, p, span, ul, li, ol, h1, h2, h3, h4, input, textarea{
    margin: 0;
    padding: 0;
    font-weight: normal;
    list-style: none;
    font-style: normal;
}
ul, menu, dir {
    display: block;
    list-style-type: disc;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 40px;
}
.first_container li {
    font-size: 16px;
    line-height: 36px;
} */
</style>
<div class="row-fluid">
	<div class="span12">
		<!-- BEGIN EXTRAS PORTLET-->
		<div class="portlet box">
			<div class="portlet-title">
				<div class="caption">
					<h5>商铺装修</h5>
				</div>
			</div>
			<div class="portlet-body form">

				<div class="alert alert-error " id="errtip" style="display: none;"></div>
				<div class="row-fluid">
					<div style="border: 2px solid #0094ff;" class="span4"
						id="minAppDiv">
						<iframe src="${shopUrl}" width="100%" height="500" name="minApp"
							id="minApp" frameborder="no" scrolling="no"
							allowtransparency="yes" style=""></iframe>

					</div>

					<div id="flyTip"
						style="display: none; position: absolute; background-color: #FFFFFF; filter: alpha(opacity = 50); -moz-opacity: 0.5; -khtml-opacity: 0.5; opacity: 0.5;">
					</div>
					<div id="flyAppTip"
						style="display: none; position: absolute; background-color: gray; filter: alpha(opacity = 50); -moz-opacity: 0.5; -khtml-opacity: 0.5; opacity: 0.5;">
					</div>
					<div class="span4">
						<div class="first_container">

							<ul>
								<!-- <li>你可以自定义图片/文字导航</li>
								<li>设置商品的展示方式</li>
								<li>选择店铺招牌的展示风格</li>
								<li>制作图片广告</li> -->
							</ul>
						</div>
						<!-- <div  style="text-align: center;">
							<button type="button" id="preview_btn" style="width: 100%;" class="btn blue">预览店铺</button>
						</div> -->
					</div>

				</div>
				<div class="row-fluid">
					<div class="span4">
						<button type="button" id="preview_btn"
							style="margin-top: 50px; width: 100%;" class="btn blue">预览店铺</button>
					</div>
				</div>
			</div>
		</div>
		<!-- END EXTRAS PORTLET-->
	</div>
</div>


<script>
	$(document).ready(function() {

		tableAction.initSaveAction({
			formId : 'shopEditForm',
			saveUrl : '${contextPath}/Admin-Shop-save.action',
			saveBtnId : 'shop_save_btn',
			queryUrl : '${contextPath}/Admin-Shop-show.action',
		});

		$("#minAppDiv").mouseenter(function(e) {
			flyTip($('#minApp'));
		});

		$("#flyTip").mouseleave(function(e) {
			var flyTip = $('#flyTip');
			flyTip.hide();
		});

		$('#preview_btn').bind("click", function() {
			/* var aa = $('#minApp').contents().find('.templateKey').each(function(e){
				$(this).mouseenter(function(e) {   
					flyAppTip($(this)); 
				}); 
				
			});  */
			//var aa = = $(window.frames["iframeName"].document).find(".templateKey").html();
			window.open('${shopUrl}');
		});
		$("#flyAppTip").mouseleave(function(e) {
			var flyTip = $('#flyAppTip');
			flyTip.hide();
		});
	});

	function flyTip(object) {

		var offset = object.offset();
		console.log('top:' + offset.top);

		var offsetLeft = offset.left;
		var offsetTop = offset.top;
		var offsetWidth = object.css('width');
		var offsetHeight = object.css('height');
		console.log(object[0].tagName + ":" + offsetLeft + "," + offsetTop
				+ "," + offsetWidth + "," + offsetHeight);
		var flyTip = $('#flyTip');
		flyTip.css("top", offsetTop);
		flyTip.css("left", offsetLeft);
		flyTip.css("width", offsetWidth);
		flyTip.css("height", offsetHeight);
		flyTip.show();

	}

	function flyAppTip(object) {
		var minApp = $('#minApp');
		var minAppOffset = minApp.offset();

		var offset = object.offset();
		console.log('top:' + offset.top);

		var offsetLeft = offset.left + minAppOffset.left;
		var offsetTop = offset.top + minAppOffset.top;
		var offsetWidth = object.css('width');
		var offsetHeight = object.css('height');
		console.log(object[0].tagName + ":" + offsetLeft + "," + offsetTop
				+ "," + offsetWidth + "," + offsetHeight);
		var flyTip = $('#flyAppTip');
		flyTip.css("top", offsetTop);
		flyTip.css("left", offsetLeft);
		flyTip.css("width", offsetWidth);
		flyTip.css("height", offsetHeight);
		flyTip.show();

	}

	function uploadNavPic() {
		ajax.upload({
			fileEleId : 'upfile1',
			filePathId : 'shopIcon',
			successFn : function(data) {
				var isImg = /\.(gif|jpg|jpeg|png|GIF|JPG|PNG)$/
						.test(data.result.webfilePath);
				if (isImg)
					$('#imgShow').attr("src", data.result.webfilePath);
			}
		})
	}
</script>

